<!DOCTYPE html>
<html>
    <head>

        <link rel="canonical" href="http://www.jointjs.com/" />
        <meta name="description" content="Create interactive diagrams in JavaScript easily. JointJS plugins for ERD, Org chart, FSA, UML, PN, DEVS, LDM diagrams are ready to use." />
        <meta name="keywords" content="JointJS, JavaScript, diagrams, diagramming library, UML, charts" />

        <link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700" rel="stylesheet" type="text/css" />
        <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

        <link rel="stylesheet" href="css/tutorial.css" />
        <link rel="stylesheet" href="../node_modules/prismjs/themes/prism.css">

        <!-- Dependencies: -->
        <script src="../node_modules/jquery/dist/jquery.js"></script>
        <script src="../node_modules/lodash/lodash.js"></script>
        <script src="../node_modules/backbone/backbone.js"></script>

        <link rel="stylesheet" type="text/css" href="../build/joint.min.css" />
        <script type="text/javascript" src="../build/joint.min.js"></script>

        <title>JointJS - JavaScript diagramming library - Getting started.</title>

    </head>
    <body class="language-javascript tutorial-page">

        <script>
            SVGElement.prototype.getTransformToElement = SVGElement.prototype.getTransformToElement || function(toElement) {
                return toElement.getScreenCTM().inverse().multiply(this.getScreenCTM());
            };
        </script>
        <div class="tutorial">

            <h2>Archive</h2>

            <p>This is the final section of the JointJS tutorial.
                We presume that you are already familiar with the <a href="hello-world.html">basic</a>,
                <a href="intermediate.html">intermediate</a>, and <a href="advanced.html">advanced</a> sections of the
                tutorial.</p>

            <p>This section preserves advanced tutorials we created for past versions of JointJS.
                The current list of topics in the tutorial archive can be found in the sidebar of this page.</p>

            <p>We provide these articles because we think you may find them useful if you are facing a similar problem
                in your use of the JointJS library.
                However, these tutorials are provided with a strong disclaimer that they may no longer show the best
                practices of JointJS:</p>

            <ul>
                <li>They may use outdated/deprecated API calls or inherit from superseded shape collections.</li>
                <li>Many of them use SVG string markup for custom Element/Link shape definitions; we have since started
                recommending using JSON markup instead.</li>
                <li>The Element and Link types defined there may not serialize properly.</li>
                <li>Or they may show other problems.</li>
            </ul>

            <p>Our current recommendations on best practices can be found in the appropriate sections of the
                <a href="hello-world.html">basic</a> and <a href="intermediate.html">intermediate</a> tutorial.</p>

        </div><!--end tutorial-->

        <script src="../node_modules/prismjs/prism.js"></script>
    </body>
</html>
